@mixin border_1px(
  $border_width: 1px, 
  $border_color: '#ccc',
  $border_radius: 0
) {
  position: relative;
  border-radius: $border_radius;

  &::after {
<<<<<<< HEAD
    // 用以解决边框layer遮盖内容
=======
>>>>>>> before-10-1
    pointer-events: none;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    content: '';
    // border: 1px solid #ee7530;
    border-width: $border_width;
    border-color: $border_color;
    border-style: solid;
    transform-origin: left top;

    @media screen and (-webkit-max-device-pixel-ratio: 1.49) {
      width: 100%;
      height: 100%;
    }

    @media screen and (-webkit-min-device-pixel-ratio: 1.5), (-webkit-max-device-pixel-ratio: 2.49) {
      width: 200%;
      height: 200%;
      transform: scale(50%);
      border-radius: $border_radius * 2;
    }

    @media screen and (-webkit-min-device-pixel-ratio: 2.5) {
      width: 300%;
      height: 300%;
      transform: scale(0.333333);
      border-radius: $border_radius * 3;
    }
  }
}